﻿@model brand.admin.cyt369.com.services.Models.Brand
@{
    Layout = null;
    var plugName = brand.admin.cyt369.com.Areas.BrandAdmin.Models.PlugName.Name;
    var dlgName = this.Context.Request.Query["dlg"];

    var doAuditFunName = PageViewModel.PageFunctionName(this, "do_audit_article", plugName);
    var doAuditDlgName = PageViewModel.ControlID(this, "do_audit_article_dlg", plugName);
    var doSaveAuditResultFunName = PageViewModel.PageFunctionName(this, "do_save_audit_article_result", plugName);

    var viewImageList = PageViewModel.ControlID(this, "view_img", plugName);
    var northPanel = PageViewModel.ControlID(this, "north_np", plugName);
    IQueryable<brand.admin.cyt369.com.services.Models.City> citys = ViewBag.citys as IQueryable<brand.admin.cyt369.com.services.Models.City>;
}
<div class="easyui-layout brand-view-dlg" fit="true">
    <style type="text/css">
        .brand-audit-dlg {
        }

        .brand-view-dlg .image-list {
        }

        .brand-view-dlg .image-item {
            margin-bottom: 20px;
            border: solid 1px #ddd;
        }

            .brand-view-dlg .image-item .img {
                width: 100%;
                height: 130px
            }

            .brand-view-dlg .image-item .img-name {
                color: rebeccapurple;
                overflow: hidden;
                height: 20px;
                line-height: 20px;
                font-size: 0.8em;
            }

        .brand-view-dlg .doc-body {
            padding: 10px 50px 20px 50px;
        }

        .brand-view-dlg .title {
            margin-top: 15px;
            min-height: 50px;
            line-height: 50px;
            font-size: 2rem;
        }

        .brand-view-dlg .labels {
            height: 45px;
            line-height: 45px;
            margin-bottom: 10px;
            border-bottom: dotted 1px gray;
            display: flex;
            justify-content: space-between;
        }

            .brand-view-dlg .labels .label {
                color: gray;
                margin-right: 20px;
                font-size: 0.8em;
            }

        .brand-view-dlg .summary {
            min-height: 60px;
            line-height: 25px;
            padding: 0px 20px 10px 20px;
            background-color: #f8f8f8;
            font-size: 0.9rem;
            color: gray;
        }

        .brand-view-dlg .content {
            min-height: 600px;
            margin-top: 20px;
            padding: 20px 10px 10px 10px;
            line-height: 25px;
            font-size: 1.1rem;
            padding: 5px;
        }

            .brand-view-dlg .content span {
                line-height: 25px;
            }

            .brand-view-dlg .content section {
                width: 100%;
            }

            .brand-view-dlg .content p {
                text-indent: 30px;
                line-height: 25px;
            }

            .brand-view-dlg .content img {
                max-width: 800px;
            }

            .brand-view-dlg .content table {
                width: 100%
            }




        .fr {
            float: right;
        }
        /* 详细界面的顶部的基本信息部分 */
        .des-top {
            height: 200px;
            box-sizing: border-box;
            padding: 5px;
            border-radius: 6px;
            background-color: #fff;
            box-shadow: #dee 0px 0px 2px;
        }

        /* 顶部右边的文本基本信息 */

        .des-top-rightbox {
            width: 100%;
        }

        .des-top-card {
            width: 100%;
            height: 30px;
            border-radius: 6px;
            border: 1px dotted #ccc;
            box-sizing: border-box;
            padding: 5px 35px;
            display: flex;
            justify-content: space-between;
            margin-top: 5px;
        }

            .des-top-card li {
                display: inline-block;
                width: 20%;
                text-align: center;
            }

            .des-top-card dt {
                color: #666;
                overflow: hidden;
                white-space: nowrap;
            }

                .des-top-card dt span {
                    font-size: 16px;
                    font-weight: 600;
                    color: #c1292e;
                    overflow: hidden;
                    white-space: nowrap;
                    margin-top: 15px;
                }

        .des-top-intro {
            width: 100%;
            margin-top: 10px;
            font-size: 14px;
        }

            .des-top-intro dl dt {
                display: inline-block;
                width: 100%;
                line-height: 20px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

                .des-top-intro dl dt em {
                    color: #666;
                }

                .des-top-intro dl dt span {
                    color: #999;
                }

            .des-top-intro dl dd {
                display: inline-block;
                width: calc(50% - 50px);
                line-height: 20px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                margin-left: 0px;
            }

                .des-top-intro dl dd em {
                    color: #666;
                }

                .des-top-intro dl dd span {
                    color: #999;
                }

                    .des-top-intro dl dd span a {
                        color: #999;
                        display: inline-block;
                    }

            .des-top-intro dl dt span a {
                color: #999;
                display: inline-block;
            }

        /* 主要内容的中间样式 */
        .des-middle {
            overflow: auto;
            margin-top: 15px;
        }

            .des-middle .Lcont {
                width: 895px;
            }

        .des-middle-box {
            width: 895px;
            border-radius: 6px;
            background-color: #fff;
        }
        /* 主要内容的中间部分导航样式 */
        .des-middle-box-title {
            position: static;
            width: 100%;
            margin: 0px auto;
            box-shadow: none;
            top: 0px;
            left: 0px;
            z-index: 999;
            height: 57px;
            background-color: #fff;
        }

            .des-middle-box-title ul {
                position: static;
                width: 895px;
                margin: 0px auto;
                top: 0px;
                left: 64.5px;
                height: 57px;
                border-bottom: 2px solid #f9f9f9;
                /* position: relative; */
                background-color: #fff;
            }

                .des-middle-box-title ul li {
                    display: inline-block;
                    width: 88px;
                    height: 57px;
                    line-height: 57px;
                    text-align: center;
                    margin: 0 24px;
                }

                    .des-middle-box-title ul li a {
                        display: block;
                        font-size: 16px;
                    }

                        /* 选定后的类名信息 此时还没有使用这里是要配合我的js使用*/
                        .des-middle-box-title ul li a.active {
                            border-bottom: 2px solid #c0292e;
                            color: #c0292e;
                        }

        /* 主要内容部分的具体信息位置 */
        .des-middle-box-info {
            margin-top: 10px;
            box-sizing: border-box;
            padding: 0 23px 23px;
        }

            .des-middle-box-info .des-middle-box-info-title h3 {
                line-height: 52px;
                position: relative;
                font-size: 18px;
                color: #c0292e;
                border-bottom: 1px solid #e0dfdf;
                margin-bottom: 10px;
            }

                .des-middle-box-info .des-middle-box-info-title h3::before {
                    position: absolute;
                    left: -23px;
                    top: 15px;
                    display: block;
                    width: 6px;
                    height: 24px;
                    background-color: #c0292e;
                    content: "";
                }

            .des-middle-box-info .des-middle-box-info-title .RichText {
                overflow: hidden;
                width: 100%;
            }

            .des-middle-box-info .des-middle-box-info-title p {
                font-size: 15px;
                text-indent: 28px;
                color: #666;
                line-height: 26px;
                padding: 5px 0;
            }
    </style>
    <div data-options="region:'west',split:true,border:false" class="min-scrollbar" style="width:250px;border-right:solid 1px #ddd;padding:10px;">
        @if (Model.BrandImages != null)
        {
            <ul id="@viewImageList" class="image-list">
                @foreach (var item in Model.BrandImages)
                {
                    string imgPath = item.ImagePath;
                    if (!string.IsNullOrEmpty(imgPath))
                    {
                        imgPath = string.Format("{0}/{1}", Admin.CYT369.Com.Utility.SystemSettingService.Instance.BrandBucket.HttpURL, imgPath);
                    }
                    <li class="image-item">
                        <img class="img" src="@imgPath" />
                        <div class="img-name">@item.Name</div>
                    </li>
                }
            </ul>
            <script type="text/javascript">
                $(function () {
                    $('#@viewImageList').viewer({
                        url: 'src',
                        hidden: function () {
                            $('#@northPanel').show();
                        },
                        viewed: function () {
                            $('#@northPanel').hide();
                        }
                    });


                    let id = $("#Id").val()
                    $.ajax({
                        url: '~/@plugName/Brand/GetBrandExtension?brandId=' + id,
                        contentType: 'application/json',
                        success: function (e) {
                            console.log(e)
                            $("#BrandDetails").prop("innerHTML", e.BrandDetails)
                            $("#FranchiseAdvantages").prop("innerHTML", e.FranchiseAdvantages)
                            $("#FranchiseConditions").prop("innerHTML", e.FranchiseConditions)
                            $("#FranchiseProcess").prop("innerHTML", e.FranchiseProcess)
                        }
                    })
                });
            </script>
        }
    </div>
    <div data-options="region:'center',border:false" class="min-scrollbar doc-body">
        <div class="title">@Model.Name</div>
        <div class="labels">
            @*             <div>
            <span class="label">修改时间：@Model.EditDate.Value.ToString("yyyy年M月d日")</span>
            @if (!string.IsNullOrEmpty(Model.Author))
            {
            <span class="label">作者：@Model.CreateDate</span>
            }
            @if (string.IsNullOrEmpty(Model.EditDate.Value))
            {
            <span class="label">编辑：@Model.EditDate.Value</span>
            }
            else
            {
            <span class="label">编辑：@string.Format("{0}({1})", Model.EditDate, Model.EditDate)</span>
            }
            @if (Model.IsAds)
            {
            <span class="label">广告内容</span>
            }
            @if (Model.GotoTarget && !string.IsNullOrEmpty(Model.TargetURL))
            {
            <span class="label">跳转目标：@Model.TargetURL</span>
            }
            </div> *@
        </div>
        <div class="body-content">
            @* 品牌详情 *@
            <!-- 详细界面的主要部分 -->
            @if (Model != null)
            {
                <div class="des-main wrap clear">
                    <input type="hidden" id="Id" value="@Model.Id" />
                    <input type="hidden" id="EditorID" name="EditorID" value="@Model.EditorID" />

                    <!-- 主要内容部分 -->
                    <div class="des-top w1200">

                        <!-- 右侧介绍 -->
                        <div class="des-top-rightbox">
                            <ul class="des-top-card">
                                <li>
                            <dt>投资金额：<span></span></dt>
                                    @*<dd>@brand.cyt369.com.MODELS.BrandHelper.GetAmountString(Model.Amount)</dd>*@
                            </li>
                            <li>
                            <dt>
                                品牌发源地：
                                        @if (citys != null)
                                        {
                                            @foreach (var city in citys)
                                            {
                                                if (city.Id == Model.FranchiseRegionID)
                                                {
                                            <span>@city.CityName</span>
                                                }

                                            }
                                        }
                            </dt>
                            </li>
                            <li>
                            <dt>门店数量: <span>@Model.StoreCount 家</span></dt>
                            </li>
                            <li>
                            <dt>咨询人数: <span>@Model.InquiryCount</span></dt>
                            </li>
                            </ul>

                            <div class="des-top-intro">
                                <dl>
                                    <dt>
                                        <em>企业名称:</em>
                                        <span>深圳青春东北泥路烤肉管理有限公司</span>
                                    </dt>
                                </dl>

                                <dl>
                                    <dd>
                                        <em>所属行业:</em>
                                        <span>
                                            <a href="" target="_blank">@Model.Category.CategoryName</a>
                                        </span>
                                    </dd>
                                    <dd>
                                        <em>主营产品:</em>
                                        <span>@Model.MainProduct</span>
                                    </dd>
                                </dl>

                                <dl>
                                    <dd>
                                        <em>适合人群:</em>
                                        <span>@Model.TargetAudience</span>
                                    </dd>
                                    <dd>
                                        <em>发展模式:</em>
                                        <span>@Model.DevelopmentModel</span>
                                    </dd>
                                </dl>

                                <dl>
                                </dl>

                                <dl>
                                    <dt>
                                        <em>招商网站:</em>
                                        <span>
                                            @if (@Model.FranchiseWebsite != null && @Model.FranchiseWebsite != "")
                                            {
                                                <a href="@Model.FranchiseWebsite" target="_blank">@Model.FranchiseWebsite</a>
                                            }
                                            else
                                            {
                                                <span>暂无</span>
                                            }
                                        </span>
                                    </dt>
                                </dl>
                            </div>
                        </div>
                    </div>
                    <div class="summary">@Model.Brief</div>
                    <!-- 主要内容的中间部分的详细加盟信息 -->
                    <div class="des-middle w1200">
                        <!-- 左边部分 -->
                        <div class="Lcont fl">
                            <div class="des-middle-box">
                                <div class="des-middle-box-title">
                                    <ul class="detail-nav-ul">
                                        <li><a class="active" href="#BrandDetails">品牌信息</a></li>
                                        <li><a href="#FranchiseAdvantages">加盟优势</a></li>
                                        <li><a href="#FranchiseConditions">加盟条件</a></li>
                                        <li><a href="#FranchiseProcess">加盟流程</a></li>
                                    </ul>
                                </div>
                                <div class="des-middle-box-info">
                                    <!-- 品牌信息的位置 -->
                                    <div class="des-middle-box-info-title brand_info" id="des-title-active1">
                                        <h3>品牌信息</h3>
                                        <div id="BrandDetails" class="RichText">
                                            Model.BrandExtension.BrandDetails
                                        </div>

                                    </div>
                                    <!-- 加盟优势的位置 -->
                                    <div class="des-middle-box-info-title brand_info" id="des-title-active2">
                                        <h3>加盟优势</h3>
                                        <div id="FranchiseAdvantages" class="RichText">
                                            Model.BrandExtension.FranchiseAdvantages
                                        </div>


                                    </div>
                                    <!-- 加盟条件的位置 -->
                                    <div class="des-middle-box-info-title brand_info" id="des-title-active3">
                                        <h3>加盟条件</h3>
                                        <div id="FranchiseConditions" class="RichText">
                                            Model.BrandExtension.FranchiseConditions
                                        </div>


                                    </div>
                                    <!-- 加盟流程的位置 -->
                                    <div class="des-middle-box-info-title brand_info" id="des-title-active4">
                                        <h3>加盟流程</h3>
                                        <div id="FranchiseProcess" class="RichText">
                                            Model.BrandExtension.FranchiseProcess
                                        </div>


                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            }
        </div>

    </div>
    <div id="@northPanel" data-options="region:'south',border:false" style="height:60px;border-top:solid 1px #ddd;">
        <div class="audit-panel">
            <script type="text/javascript">
                function @(doAuditFunName)() {
                    var dlg = $dlg('@doAuditDlgName');
                    dlg.dialog({
                        title: '审核说明', width: 500, height: 280,
                        closed: false, cache: false, modal: true, maximizable: false, resizable: true,
                        href: '~/@brand.admin.cyt369.com.Areas.BrandAdmin.Models.PlugName.Name/Brand/_AuditBrandDlgRemark',
                        onResize: function () {
                            $(this).dialog('center');
                        },
                        buttons: [
                            {
                                text: "审核通过",
                                handler: function () { @(doSaveAuditResultFunName)(true); },
                                iconCls: "icon-save"
                            }, {
                                text: "审核不通过",
                                handler: function () { @(doSaveAuditResultFunName)(false); },
                                iconCls: "icon-cancel"
                            }
                        ]
                    });
                }

                function @(doSaveAuditResultFunName)(result) {
                    var form = $("#@doAuditDlgName").find("form");
                    if (form.form('enableValidation').form('validate')) {
                        var item = form.form_to_json(function (form, item) {
                        
                        });
                        item.Id = @Model.Id;
                        item.Result = result;
                        $.ajax({
                            url: "~/@brand.admin.cyt369.com.Areas.BrandAdmin.Models.PlugName.Name/Brand/DoBrandAudit",
                            type: "POST",
                            data: item,
                            success: function (e) {
                                $('#@doAuditDlgName').dialog('close');
                                $('#@dlgName').dialog('close');
                            },
                            error: function (e) {
                                ShowAjaxError(e);
                            }
                        });
                    }
                }
            </script>
            <div class="Btn auditCssBtn" onclick="@doAuditFunName ()"> 审 核 </div>
            <div class="Btn closeCssBtn" onclick="$('#@dlgName').dialog('close')"> 关 闭 </div>
        </div>
    </div>
</div>